<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>

    <style>
        p {
            color: red;
        }

        #pname {
            color: green;
            font-size: 20pt;
            font-weight: bold;
        }
    </style>

    <style>
        span#identified {
            background-color: DodgerBlue;
        }
    </style>
</head>

<body>

    <!-- CSS选择器 -->
    <!-- https://developer.mozilla.org/zh-CN/docs/Learn/CSS/Building_blocks/Selectors -->

    <!-- ID 选择器 -->
    <!-- https://developer.mozilla.org/zh-CN/docs/Web/CSS/ID_selectors -->
    <!-- 在一个HTML文档中，CSS类选择器会根据元素的类属性中的内容匹配元素。类属性被定义为一个以空格分隔的列表项，在这组类名中，必须有一项与类选择器中的类名完全匹配，此条样式声明才会生效。 -->


    <p id="pname">Welcome to BookYourHotel Website.</p>
    <p>Hotel booking facility at your doorstep.</p>

    <span id="identified">Here's a span with some text.</span>
    <span>Here's another.</span>

</body>

</html>